<!-- 恒华出行宝春节大聚惠 -->
<template>
    <div class="activityGreatBenefit">
        <x-header v-show="!isWeChar">
            <div slot="default" class="common__header--title">{{pageTtile}}</div>
            <div @click="goBack" slot="overwrite-left" class="common__header--img">
                <img slot="icon" src="~assets/x3/ico/goback1.png" class="go-back">
            </div>
        </x-header>
        <div class="activity_img">
            <img src="~assets/activity/greatBenefit_head.jpg">
            <img src="~assets/activity/greatBenefit_product1.jpg" @click="goProductDetail(product1)">
            <img src="~assets/activity/greatBenefit1.jpg">
            <img src="~assets/activity/greatBenefit_product2.jpg" @click="goProductDetail(product2)">
            <img src="~assets/activity/greatBenefit2.jpg">
            <img src="~assets/activity/greatBenefit_product3.jpg" @click="goProductDetail(product3)">
            <img src="~assets/activity/greatBenefit3.jpg">
            <img src="~assets/activity/greatBenefit_product4.jpg" @click="goProductDetail(product4)">
            <img src="~assets/activity/greatBenefit_footer.jpg">
        </div>
    </div>
</template>

<script>
import { XHeader, Group, Cell, XButton, XInput, XSwitch, Selector, Toast } from "vux";
import { Mutations, RouteUrl, StrLenth, Url_Key } from "src/common/const";
import { mapState, mapActions } from "vuex";
import { RequestUrl } from "src/common/url";
import SharePage from "src/js/sharePage"; //引入微信分享js
export default {
    components: { XHeader, Group, Cell, XButton, XInput, XSwitch, Selector, Toast },
    computed: mapState(["isWeChar", "user", "saveInsure", "shareUuid"]),
    data() {
        return {
            pageTtile: "恒华出行宝春节大聚惠",
            product1: {},
            product2: {},
            product3: {},
            product4: {},
            shareTitle: "恒华出行宝春节大聚惠",
            shareDesc: "家财险、账户安全险、旅行险，保您家旺财旺人更旺！",
            shareImgUrl: "",
        };
    },
    methods: {
        goBack() {
            this.$common.goBack(this);
        },
        //跳转到对应产品
        goProductDetail(productObj) {
            let curInsure = {
                riskCode: productObj.riskCode,
                indexInsure: productObj
            };
            //保存产品信息
            this.$common.storeCommit(this, Mutations.INSURE_DATA_INDEX_DATA, curInsure);
            let parmList = [];
            let urlPro = {
                key: Url_Key.PRODUCT_ID,
                value: this.saveInsure.indexData.id
            }
            parmList.push(urlPro);

            localStorage["IS_SHOP_DETAIL"] = "F";
            //组合URI并跳转
            this.$common.goUrl(this, RouteUrl.DETAILS, this.$common.setShareUrl(parmList));

            // this.$common.goUrl(this, RouteUrl.DETAILS, "?pro=" + productId);
        },
        //初始化分享
        initShare() {
            let _this = this;
            let parmList = [];
            let uuid = "";
            if (this.$common.isNotEmpty(this.saveInsure.refShareUUid) && (this.saveInsure.refereeData.storeFlag == "1" || this.saveInsure.refereeData.storeFlag == 1)) {
                sessionStorage["SHARE_COMMON_TYPE"] = "REF";
                uuid = this.saveInsure.refShareUUid;
            } else {
                sessionStorage["SHARE_COMMON_TYPE"] = "USER";
                if (this.user.isLogin) {
                    uuid = this.$encode.hex_md5(this.user.userDto.userCode + ":1");
                    this.$common.storeCommit(this, Mutations.SET_SHARE_UUID, uuid);
                }
                //从vuex获取当前md5的值
                uuid = this.shareUuid;
            }
            let urlParm = {
                key: Url_Key.SHARE_UUID,
                value: uuid
            }
            parmList.push(urlParm);
            let shareUrl = RequestUrl.BASE_URL + RouteUrl.ACTIVITY_GREAT_BENEFIT + this.$common.setShareUrl(parmList);
            let imgUrl = this.shareImgUrl;
            if (this.$common.isEmpty(imgUrl)) {
                imgUrl = RequestUrl.BASE_URL_UPLOAD + "assets/x3/logo.jpg";
            }
            let weChatData = {
                _this: this,
                shareData: {
                    title: this.shareTitle,
                    desc: this.shareDesc,
                    imgUrl: imgUrl,
                    url: shareUrl,
                    _this: this,
                    type: 7//新春大聚惠类型
                }
            };
            // 微信分享
            SharePage.weChatShare(weChatData);
        },
        //初始化当前页面信息
        initPage() {
            document.title = this.pageTtile;

            let _this = this;
            _this.$common.storeCommit(_this, Mutations.UPDATE_LOADING_STATUS, true);//loading
            _this.$http.post(RequestUrl.GET_ACTIVITY_GREAT_BENEFIT).then(function (res) {
                _this.$common.storeCommit(_this, Mutations.UPDATE_LOADING_STATUS, false);//loading
                if (res.state == 0) {
                    //产品ID
                    let products = res.result.products;
                    for (let i = 0; i < products.length; i++) {
                        if (products[i].productCname == "“随心游”交通工具保障计划") {
                            _this.product1 = products[i];
                        } else if (products[i].productCname == "“全家保”境内旅行险") {
                            _this.product2 = products[i];
                        } else if (products[i].productCname == "安居乐家财险") {
                            _this.product3 = products[i];
                        } else if (products[i].productCname == "个人账户资金安全保险") {
                            _this.product4 = products[i];
                        }
                    }
                    //分享内容
                    let greatBenefit = res.result.greatBenefit;
                    _this.shareTitle = greatBenefit.title;
                    _this.shareDesc = greatBenefit.desc;
                    _this.shareImgUrl = greatBenefit.imgUrl;
                    //初始化分享
                    _this.initShare();
                }
            });
        },
    },
    mounted() {
        this.$init.subPageInit(this);
        //初始化当前页面信息
        this.initPage();
    },
}
</script>

<style lang="scss" >
.activityGreatBenefit {
  margin: 0px;
  padding: 0px;
  .activity_img {
    position: relative;
    img,
    div {
      display: block;
      width: 100%;
      margin: 0px;
      padding: 0px;
    }
  }
}
</style>
